<template>
  <div class="flex flex-col items-start p-4 bg-white rounded-lg shadow-md w-[240px] mx-[10px]">
    <div class="flex items-center mb-2 w-full">
      <img :src="icon" alt="icon" class="w-6 h-6 mr-2" />
      <span class="text-lg text-[20px] text-[#394d73] ml-2 whitespace-nowrap">{{ label }}</span>
    </div>
    <div class="flex justify-end w-full items-end">
      <span class="text-[32px] text-[#394d73]">{{ value }}</span>
      <span class="text-[14px] text-[#394d73]">元</span>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { defineProps } from 'vue';

interface Props {
  icon: string;
  label: string;
  value: string;
}

defineProps<Props>();
</script>
